<template>
	<div class="header">
		<p>{{count}}  {{getcount}}  {{getCount}} </p>
		<button @click="increment()">增加1</button>
		<button @click="decrement()">减少1</button>
		<button @click="incrementAync()">延迟加1</button>
	</div>
</template>
<script>
import { mapGetters, mapState, mapActions } from 'vuex'
export default {
	name: 'MyHeader',
	computed:{
		...mapState(['count']),
		...mapGetters(['getCount']),
		getcount(){
			return this.$store.state.user.count
		}
	},
	methods:mapActions(['increment','decrement','incrementAync'])
}
</script>
<style lang="less" scoped>
.header{
	height:134px;
	width:100%;
	font-size:14px;
	background: rgba(0,0,0,0.1);
}
</style>